<template>
  <div>
    <p v-html="detailList.content"></p>
    <van-goods-action>
      <van-goods-action-icon icon="chat-o" text="客服" @click="onClickIcon" />
      <van-goods-action-icon icon="shop-o" text="店铺" @click="onClickIcon" />
      <van-goods-action-button
        color="#be99ff"
        type="warning"
        text="加入购物车"
        @click="onClickButton"
      />
      <van-goods-action-button color="#7232dd" type="danger" text="立即购买" />
    </van-goods-action>
  </div>
</template>

<script>
import { loadDataByIdAPI, AlertShopCarDataAPI } from '../service/product';

export default {
  name: 'VueYimutianDetail',

  data() {
    return {
      detailList: {},
    };
  },
  async created() {
    console.log(this.$route.query.id);
    const res = await loadDataByIdAPI(this.$route.params.id);
    this.detailList = res.data.data;
    console.log(this.detailList);
  },

  mounted() {},

  methods: {
    onClickIcon() {
      this.$router.push({
        name: 'VueYimutianList',
      });
    },
    async onClickButton() {
      console.log(1);
      const res = await AlertShopCarDataAPI({
        product: this.detailList.id,
        amount: 1,
        price: this.detailList.price,
      });
      console.log(res.data);
      if (res.data.code === 1) {
        this.$router.push({
          name: 'VueYimutianShopCar',
        });
      }
    },
  },
};
</script>

<style lang="scss" scoped>
</style>
